<%@ page import="Action.Sys.Setting" %>
<%@ page import="java.util.LinkedList" %>
<%@ page import="java.util.HashMap" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%--
  Created by IntelliJ IDEA.
  User: 高金磊
  Date: 2021/4/17
  Time: 19:47
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
    <title></title>
    <link rel="icon" href="<%=basePath%>favicon.ico" type="image/ico">
    <!--核心样式-->
    <link rel="stylesheet" href="<%=basePath%>css/goodsstyle.css">

    <link href="<%=basePath%>css/bootstrap.min.css" rel="stylesheet">
    <link href="<%=basePath%>css/fonts.css" rel="stylesheet">
    <link href="<%=basePath%>css/style.css" rel="stylesheet">
    <!--图标库-->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">


    <style type="text/css">
        *{
            padding:0;
            margin:0;
        }
        a{
            text-decoration: none;
        }

        .form-control{
            display: inline-block;
            width: auto;
            padding: 6px 12px;
            font-size: 14px;
            line-height: 1.42857143;
            color: #555;
            background-color: #fff;
            background-image: none;
            border: 1px solid #ccc;
            border-radius: 4px;
            -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
            box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
            -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
            -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
            transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
        }
        .overflow-text{
            display: block;
            white-space:nowrap;
            overflow:hidden;
            text-overflow:ellipsis;
            opacity:0;
            clear: both;
            padding:3px 10px;
            border-radius: 10px;
            box-sizing: border-box;
            max-width: 100%;
            color:#fff;
            animation:colorchange 3s infinite alternate;
            -webkit-animation:colorchange 3s infinite alternate; /*Safari and Chrome*/
        }
        @keyframes colorchange{
            0%{
                color:red;
            }
            50%{
                color:green;
            }
            100%{
                color:#6993f9;
            }
        }
        /*组件主样式*/


        #textarea {
            display: block;
            margin:0 auto;
            overflow: hidden;
            width: 550px;
            font-size: 14px;
            height: 18px;
            line-height: 24px;
            padding:2px;
        }
        textarea {
            outline: 0 none;
            border-color: rgba(82, 168, 236, 0.8);
            box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6);
        }

    </style>
</head>
<body style="min-height: 2000px">
<div>
<%--<s:action name="ShowBookDetailInfo" >--%>

<%--<s:iterator value="#request.bookInfoEntity" var="book">--%>
<%--<img style="width: 50px" src=<%=request.getContextPath()+"/"+"cache/booksInfo/"%><s:property value="#book.book_name"/>.jpg > <br>--%>
<%--书名:<s:property value="#book.book_name"/> <br>--%>
<%--作者:<s:property value="#book.book_Author"/> <br>--%>
<%--简介:<s:property value="#book.book_Info"/> <br>--%>
<%--标签:<s:property value="#book.book_tag1"/> <br>--%>
<%--浏览量:<s:property value="#book.vister/2"/> <br>--%>
<%--书籍总数:<s:property value="#book.sum"/><br>--%>
<%--剩余可借阅数:<s:property value="#book.sum-#book.used"/><br>--%>
<%--</s:iterator>--%>
<%--<form action="LoanBook.action" method="get">--%>
<%--&lt;%&ndash;此处用户对象后期进行维护&ndash;%&gt;--%>
<%--<input type="hidden" name="user_key" value="1">--%>
<%--<input type="hidden" name="book_key" value=<s:property value="#request.bookInfoEntity.id"/>>--%>
<%--<input type="hidden" name="modify_id" value=<s:property value="#request.bookInfoEntity.id"/>>--%>
<%--<label>--%>
<%--借阅天数:<input type="number" max=<%=Setting.LoanBook_Max_day%> min=<%=Setting.LoanBook_Min_day%> name="day"/>--%>
<%--</label>--%>
<%--<input type="submit">--%>
<%--</form>--%>

<%--<s:actionerror/>--%>

<%--<form   action="AddBookComment.action" >--%>
<%--<input type="hidden" name="modify_id" value=<s:property value="#request.bookInfoEntity.id"/>>--%>
<%--<label>--%>
<%--<input type="text" name="comment" />--%>
<%--</label>--%>
<%--<input type="submit" value="发布">--%>
<%--</form>--%>
<%--评论数:<s:property value="#request.commentsize"/>        <br>--%>
<%--<s:iterator value="#request.bookCommentEntities" var="comm">--%>
<%--<s:property value="#comm.date"/>--%>
<%--<s:property value="#comm.Comment"/>--%>
<%--<br>--%>
<%--</s:iterator>--%>
<%--</s:action>--%>
</div>

<s:action name="ShowBookDetailInfo" >
    <div>

    <div class="" style="padding: 10px; width: 35%; float: left; background-color: rgba(0,0,0,0.11)" >
    <button class="btn btn-link" onclick="window.history.back()">返回上一级</button>
        <h2><s:property value="#request.bookInfoEntity.book_name"/></h2>
        <img style="width: 95%;" src=<%=request.getContextPath()+"/"+"cache/booksInfo/"%><s:property value="#request.bookInfoEntity.book_name"/>.jpg   alt=""/>
        <br>
        <strong>作者:</strong>
        <s:property value="#request.bookInfoEntity.book_Author"/>
        <br>
        <strong>标签:</strong>
        <s:property value="#request.bookInfoEntity.book_tag1"/>
        <br>
        <strong>热度</strong>:<s:property value="#request.bookInfoEntity.hot_index"/>
        <br>
            <%--<label >标签2</label>--%>
            <%--<s:property value="#request.bookInfoEntity.book_tag2"/>--%>
        <a href="">浏览量:<span class="badge"><s:property value="#request.bookInfoEntity.vister/2"/> </span></a>
            <%--<br>--%>
            <%--<br>--%>
        <a href="">评论:<span class="badge"><s:property value="#request.bookInfoEntity.getBookCommentEntitys().size()"/></span></a>
        <a href="">可借数量:<span class="badge"><s:property value="#request.bookInfoEntity.sum-#request.bookInfoEntity.used"/></span></a>
        <div>
            <form action="LoanBook.action" method="get">
                    <%--此处用户对象后期进行维护--%>

                <input type="hidden" name="book_key" value=<s:property value="#request.bookInfoEntity.id"/> >
                <input type="hidden" name="modify_id" value=<s:property value="#request.bookInfoEntity.id"/> >
                        <div style="margin-top: 30px;margin-bottom: 30px">
                            <span style="font-size: 13px; color: red"> <s:actionerror/></span>
                            <span style="font-size: 13px; color: #24bb10"> <s:actionmessage/></span>
                        </div>

                        <label>
                            借阅天数:
                            <input type="number" max=<%=Setting.LoanBook_Max_day%> min=<%=Setting.LoanBook_Min_day%> name="day"/>
                        </label>
                <button type="submit" data-loading-text="处理中..." id="b1" class="btn btn-label btn-primary"  >
                    <label class="ftsucai-gou-2">
                    </label>
                    提交申请
                </button>
            </form>
        </div>
        <div  style="margin-top: 30px">
            <h3>相关书籍推荐</h3>
            <s:iterator value="#request.relateBooks" var="books">
                <div id="container" style="margin: 10px;width: 80%;height: 400px;">
                    <div class="product-details" style="width: 100%;margin-top: 20px;padding: 0px">
                    <div style="width: 100%;height: 100%;" class="product-image">
                        <img style="width: 100%; height: 400px" src=<%=request.getContextPath()+"/"+"cache/booksInfo/"%><s:property value="#books.book_name"/>.jpg >
                        <a href="ShowBookDetailInfo.action?modify_id=<s:property value="#books.id"/>" title="点击查看图书详情">
                        <div class="info" style="cursor:pointer">
                            <h4 style="color: white">《<s:property value="#books.book_name"/>》</h4>

                            <ul style="margin-left: 20px">
                                <li><strong>作者 : </strong><s:property value="#books.book_Author"/></li>
                                <li><strong>标签 : </strong><s:property value="#books.book_tag1"/></li>
                                <li><strong>热度 : </strong><s:property value="#books.hot_index"/></li>
                                <li><strong>访问量: </strong><s:property value="#books.vister"/></li>
                                <li  style="color: #0FB25F"><strong>剩余:</strong><s:property value="#books.sum-#books.used"/></li>
                            </ul>

                        </div>
                        </a>
                    </div>
                    </div>

                </div>

            </s:iterator>
            <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
        </div>

        </div>

    </div>

    <div style="width: 62%;float:right;">
        <%--<button class="btn btn-primary" style="" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample">--%>
            <%--图书简介--%>
        <%--</button>--%>
        <%--<div class="collapse m-t-10" id="collapseExample">--%>
            <%--<div class="well">--%>
                <%--<s:property value="#request.bookInfoEntity.book_Info"/>--%>
            <%--</div>--%>
        <%--</div>--%>
            <div style="width: 100%">
                <h2 align="center">简介</h2>
                <textarea id="textarea" readonly="readonly" style="width: 100%;background-color: rgba(0,0,0,0);">
                  <s:property value="#request.bookInfoEntity.book_Info"/>
                </textarea>

                <form   action="AddBookComment.action" >
                    <input type="hidden" name="modify_id" value=<s:property value="#request.bookInfoEntity.id"/>>
                    <br>
                    <div>
                        <label>
                            <textarea id="textarea1" cols="50" rows="3" name="comment"></textarea> <br>
                            <span style="font-size: 12px">*请写下你的评论</span>
                        </label>
                        <button type="submit" data-loading-text="处理中..." id="b2" class="btn btn-label btn-primary"  style="margin-bottom: 5%" >
                            <label class="ftsucai-gou-2">
                            </label>
                            提交
                        </button>
                    </div>
                </form>
            </div>
        <div class="container-fluid" style="background-color: rgba(255,255,255,0);" >
            <div class="row" style="margin-top:5px; ">

                        <div class="col-lg-12">
                            <div class="card" style="background-color: rgba(255,255,255,0)">

                                <div class="card-body" style="background-color: rgba(255,255,255,0)">
                                    <h2>最新评论:<span class="badge"><s:property value="#request.bookInfoEntity.getBookCommentEntitys().size()"/></span></h2>
                                    <div class="table-responsive" style="background-color: rgba(255,255,255,0);max-height: 1000px;overflow-y: auto">
                                        <table class="table  table-condensed">
                                            <thead>
                                            </thead>
                                            <tbody >
                                            <s:iterator value="#request.bookCommentEntities" var="comm">
                                                <tr>
                                                    <td>
                                                        <span style="font-size: 12px"><s:property value="#comm.formatDate()"/>&nbsp;&nbsp;&nbsp;</span>
                                                        <span style="font-size: 18px"><a><s:property value="#comm.userName()"/></a>:&nbsp;&nbsp;&nbsp;</span>
                                                        <span style="font-size: 18px"><s:property value="#comm.Comment"/>&nbsp;&nbsp;&nbsp;</span>
                                                    </td>
                                                </tr>
                                            </s:iterator>
                                            </tbody>
                                        </table>
                                    </div>


                                </div>
                            </div>
                        </div>
            </div>
        </div>

    </div>


</s:action>



</body >


<script type="text/javascript" src="<%=basePath%>js/jquery.min.js"></script>
<script type="text/javascript" src="<%=basePath%>js/bootstrap.js"></script>
<script type="text/javascript" src="<%=basePath%>js/perfect-scrollbar.min.js"></script>
<script type="text/javascript" src="<%=basePath%>js/main.min.js"></script>
<script type="text/javascript" src="<%=basePath%>js/danmuindex.js"></script>
<script type="text/javascript">
    $(function(){
        $('.search-bar .dropdown-menu a').click(function() {
            var field = $(this).data('field') || '';
            $('#search-field').val(field);
            $('#search-btn').html($(this).text() + ' <span class="caret"></span>');
        });
    });
</script>
<script>
    // 按钮示例
    $('#b1').on('click', function () {
        var $btn = $(this).button('loading');
        setTimeout(function() {
            $btn.button("reset")
        }, 3e3)
    });
    $('#b2').on('click', function () {
        var $btn = $(this).button('loading');
        setTimeout(function() {
            $btn.button("reset")
        }, 3e3)
    });

</script>
<script type="text/javascript">
    var data = [
        <s:iterator value="#request.goodComments" var="comm">
        {href :'<s:property value="#comm.Comment"/>'},
        </s:iterator>

    ]
    // 数据初始化
    var Obj = $('body').barrage({
        data : data, //数据列表
        row : 4,   //显示行数
        time : 1000, //间隔时间
        gap : 20,    //每一个的间隙
        position : 'fixed', //绝对定位
        direction : 'bottom right', //方向
        ismoseoverclose : true, //悬浮是否停止
    })
    Obj.start();

    //添加评论
    // $("#submit_barraget").click(function(){
    //
    //     var val = $("#barrage_content").val();
    //     //此格式与dataa.js的数据格式必须一致
    //     var addVal = {
    //         href : '',
    //         text : val
    //     }
    //     //添加进数组
    //     Obj.data.unshift(addVal);
    //     alert('评论成功');
    //
    // }
    // )

    // $("#open").click(function(){
    //     Obj.start();
    // })
    // $("#stop").click(function(){
    //     Obj.close();
    // })
</script>


<script>
    var autoTextarea = function (elem, extra, maxHeight) {
        extra = extra || 0;
        var isFirefox = !!document.getBoxObjectFor || 'mozInnerScreenX' in window,
            isOpera = !!window.opera && !!window.opera.toString().indexOf('Opera'),
            addEvent = function (type, callback) {
                elem.addEventListener ?
                    elem.addEventListener(type, callback, false) :
                    elem.attachEvent('on' + type, callback);
            },
            getStyle = elem.currentStyle ? function (name) {
                var val = elem.currentStyle[name];

                if (name === 'height' && val.search(/px/i) !== 1) {
                    var rect = elem.getBoundingClientRect();
                    return rect.bottom - rect.top -
                        parseFloat(getStyle('paddingTop')) -
                        parseFloat(getStyle('paddingBottom')) + 'px';
                };

                return val;
            } : function (name) {
                return getComputedStyle(elem, null)[name];
            },
            minHeight = parseFloat(getStyle('height'));

        elem.style.resize = 'none';

        var change = function () {
            var scrollTop, height,
                padding = 0,
                style = elem.style;

            if (elem._length === elem.value.length) return;
            elem._length = elem.value.length;

            if (!isFirefox && !isOpera) {
                padding = parseInt(getStyle('paddingTop')) + parseInt(getStyle('paddingBottom'));
            };
            scrollTop = document.body.scrollTop || document.documentElement.scrollTop;

            elem.style.height = minHeight + 'px';
            if (elem.scrollHeight > minHeight) {
                if (maxHeight && elem.scrollHeight > maxHeight) {
                    height = maxHeight - padding;
                    style.overflowY = 'auto';
                } else {
                    height = elem.scrollHeight - padding;
                    style.overflowY = 'hidden';
                };
                style.height = height + extra + 'px';
                scrollTop += parseInt(style.height) - elem.currHeight;
                document.body.scrollTop = scrollTop;
                document.documentElement.scrollTop = scrollTop;
                elem.currHeight = parseInt(style.height);
            };
        };

        addEvent('propertychange', change);
        addEvent('input', change);
        addEvent('focus', change);
        change();
    };

    var text = document.getElementById("textarea");
    autoTextarea(text);// 调用
    var text1 = document.getElementById("textarea1");
    autoTextarea(text);// 调用
</script>
</html>
